<template>
    <div style="height:100%;">
        <common @getData="getData" :spaceType="spaceType">
            <template slot="btn">
                <el-button type="primary" size="mini" @click="spaceType = 2,tableFlag = 2">报警历史</el-button>
                <el-button type="primary" size="mini" @click="spaceType = 2,tableFlag = 1">映射表</el-button>
            </template>
            <template slot="data">
                <div>
                    <alarmHistory v-if="tableFlag == 2"></alarmHistory>
                    <deviceMapping v-if="tableFlag == 1"></deviceMapping>
                </div>
            </template>
            <template slot="search">
                <tips></tips>
            </template>
            <template v-if="spaceType == 2" slot="sectionFilter">
                <!-- <keep-alive> -->
                        <comselect1  v-if="tableFlag == 1"></comselect1>
                        <comselect2  v-if="tableFlag == 2"></comselect2>
                <!-- </keep-alive> -->
            </template>
        </common>
    </div>
</template>

<script>
import common from '../../components/common_layout.vue';
import safe from './safe.vue';
import deviceMapping from './deviceMapping.vue';
import alarmHistory from './alarmRecords.vue'
import tips from '../../components/legend_tips.vue';
import comselect1 from './comselect1.vue'
import comselect2 from './comselect2.vue'
export default {
    data() {
        return {
            formSearch: { xqId: '' },
            tableFlag : 1,
            spaceType:1
        };
    },
    components: {
        common,
        safe,
        tips,
        deviceMapping,comselect1,comselect2,alarmHistory
    },
    methods:{
        getData(val){
            this.spaceType = val.spaceType
        }
    }
};
</script>

<style scoped>
</style>